<template>
  <div class="address">
    <tabbar>
      <div slot="left">
        <a href="#">ele.me</a>
      </div>
      <div slot="right">注册 登录</div>
    </tabbar>
    <div class="position">定位</div>
    <div class="hotcity">热门城市</div>
    <citylist :cities="cities"></citylist>
  </div>
</template>

<script>
import tabbar from "../components/tabbar.vue";
import citylist from "../components/citylist.vue";
import http from "../network/request";
import axios from "axios";
export default {
  data() {
    return {
      cities: [],
    };
  },
  //   mounted() {
  //     axios.get("https://elm.cangdu.org/v1/cities?type=group").then((res) => {
  //       console.log(res);
  //     });
  //   },
  mounted() {
    http({
      url: "/v1/cities?type=group",
    })
      .then((res) => {
        this.cities = res.data;

        console.log(this.cities);
      })
      .catch((error) => {
        console.log(error);
      });
  },
  components: {
    tabbar,
    citylist,
  },
};
</script>

<style>
.address {
  font-size: 14px;
  color: white;
}
.address .position {
  height: 4.6rem;
  margin-bottom: 0.3rem;
  box-shadow: 0 0.7px 1.5px #666;
}
.address .hotcity {
  height: 4.6rem;
  margin-bottom: 0.3rem;
  box-shadow: 0 0.7px 1.5px #666;
}
</style>